हेल्लो दोस्तों आज की इस आर्टिकल के अन्दर हम HTML के Table और List के बारे में पूरी जानकारी आप लोगो के साथ शेयर करने वाले हे , क्यू की HTML में ये Table और List का जो Concept हे वो काफी Important Concept माना जाता हे |
जिसमे Table क्या होता हे ? और किस तरह से Table को Create किया जाता हे इन सब के बारे में जानेंगे , और उसके बाद List के बारे में पड़ेंगे , जेइसे List क्या होता हे ? HTML के अन्दर कितने Types के List होते हे , इन सभी के बारे आज की (Tables and List in HTML in Hindi ) इस आर्टिकल के अन्दर बिस्तार बात करेंगे ,
और इनके अलाबा हमने पिछले आर्टिकल में HTML के Tags , Element और Attributes के बारे में बात किये थे , आप लोग उस आर्टिकल के एकबार जरुर पड़े ,
तो चलिए आज की इस आर्टिकल को शुरू करते हे ,,,

Tables and List in HTML in Hindi - Tables और List कैसे बनाये ?

HTML Tables in Hindi :-

HTML Table में Web Developer ने जो भी Data को add किया उन सभी Data को एक Row और Column के अन्दर स्टोर किया जाता हे | और इस Table को Create करने के लिए कुछ Tags का इस्तेमाल किया जाता हे , जेइसे -

1. <table> tag :-

 इस table Tag की मदत से Table को Start और End किया जाता हे | 

जेइसे - <table>.......</table>

2. <tr> tag :-

 इस tr Tag को Table Row Create करने के लिए इस्तेमाल किये जाते हे |

3. <td> tag :-

 इस td Tag की मदत से उस Table के अन्दर Data को स्टोर किया जाता हे | मतलब इस td Tag का इस्तेमाल Table के Column को Add करने के इस्तेमाल किया जाता हे |

4. <th> tag :- 

और इस th Tag को Table के Header को बनाने के लिए इस्तेमाल किये जाते हे | मतलब Row के अन्दर Header को Add किया जाता हे |
चलिए एक Example की मदत से और भी अछे से समजने की कौसिस करते हे ,,,

तो ये रहे एक Table को किस तरह से बनाया जाता हे ,मतलब Table को Create करने के लिए बेसिक Knowledge, और अगर आप लोग उस Table को और भी अछे बनाना चाहते हो तो उसके लिए निचे दिए गये इन सारे Tags को अछे से समझना होगा , आइये देखते हे -

इसे भी जरुर पड़े - HTML tags क्या हे ? 

1. <caption> tag :- 

Table में Caption को add करने के लोए इस Tags का इस्तेमाल किया जाता हे |

2. <colgroup> tag :- 

जब एक से जादा Column को add करना हो तब इस Tags का इस्तेमाल किया जाता हे |

3. <col> tag :-

 इस Tag को colgroup Tag के अन्दर इस्टाल किये जाते हे |

4. <tbody> tag :- 

इस Tag के मदत से Table में Body Content को Group के अन्दर Use किया जाता हे |

5. <thead> tag :-

 Header Content को Group के अन्दर Use करने के लिए इस Tag का इस्तेमाल किया जाता हे |

6. <tfooter> tag :-

 Table में जो Footer Content होता हे , उस Content को Group के अन्दर इस्तेमाल किया जाता हे इस Tag की मदत से |


एक Table के अन्दर आप चाहो तो इन सभी Tags को इस्तेमाल कर सकते को , ताकि वो Table दिखने में अच्छा हो , लेकिन HTML के मदत से आप Table में किसी तरह के Border को नही लगा सकते हो | उस Border को add करने के लिए CSS का इस्तेमाल किया जाता हे |

तो ये हो गये HTML में Table क्या होता हे और किस तरह से हम Table को Create कर सकते हे , उम्मीद करता हु आप लोगो को ये Concept समझमे आगेये होंगे , चलिए अब बात करते हे HTML के List के बारे में ,

HTML List  in Hindi :-

List की मदत से हम HTML के अन्दर Information को Present कर सकते हे | मतलब किसी भी Information को जब Point Wise समझाया जाता हे , तब इस List का इस्तेमाल किया जाता हे , जिससे जो भी Information हो वो अछे से समझाया जा सके | 

ये ही होता List का Concept |

Types of List in HTML :-

Basically HTML के अन्दर 3 तरह के List देखने को मिलता हे , जेइसे -

1. Ordered list
2. Unordered list
3. Description list

आइये इन सभी List के बारे में अछे से समझने की कौसिस करते हे ,

1. Ordered List :-

 Ordered List में Data item Number में Display होता हे , या फिर Alphabet की आकार में इस Ordered List को Display किया जाता हे |
मतलब जब भी किसी Information को एक Sequence में या फिर step by step समझाया जाता हे , तब इस Ordered List का इस्तेमाल किया जाता हे |

जेइसे -

1
2
3
4

इस Ordered List में दो Tags का इस्तेमाल किया जाता हे , <ol> tag और <li> tag जिसमे ol का मतलब हे Ordered List , और li का मतलब हे List Item |
Example:-

2. Unordered List :- 

Unordered List में Bullet Point को Display किया जाता हे , जिसमे सिर्फ Bullet Point ही नही बल्कि Circle, Square भी add किये जाते हे | और इस Unordered List में भी दो तरह के की Tags का इस्तेमाल होते हे , 1. <ul> tag और <li> tag , जिसमे ul का मतलब हे Unordered List और li का मतलब हे List Item |
Example : -

3. Description List :- 

इस List में Ordered List या फिर Unordered List का इस्तेमाल नही किये जाते , वो एक Description या फिर Definition की तरह Display होता हे , जिसे आप Description सूचि भी कह सकते हो |

और इस Description List के अन्दर 3 Types के Tags का इस्तेमाल किया जाता हे ,

जेइसे -

1. <dl> Tag :- इस Tag का इस्तेमाल List को Start और End करने के लिए Use किया जाता हे |
2. <dt> Tag :- List में जो Definition दिया जाता हे वो इस <dt> Tag की मदत से Display होते हे |
3. <dd> Tag :- इससे List में जो Description Data होता हे वो इस Tag की बजह से Display होती हे |
Example : -

Attributes of ol Tag :-  

ol Tag में दो तरह के Attributes का इस्तेमाल किया जाता हे ,

1. Start Attributes :- 

जब भी किसी निर्दिष्ट Number से Ordered List की Start किया जाता हे , तब इस Start Attributes का इस्तेमाल करते हे |

Example : -

<ol start =3>
    <li>Sanat </li>
    <li>Ram </li>
    <li>Kumar</li>

</ol>

Output:-

3 Sanat
4 Ram
5 Kumar


देखो इस list के अन्दर ये number 3 से start हुआ , तो इस तरह से इस start attributes का इस्तेमाल किया जाता हे |

2. Reverse Attributes :-

 जब List Item को Reverse Ordered में Display करना पड़े , तब इस Reverse Attributes का इस्तेमाल किये जाते हे |

Example :-

<ol start =3 reversed>
   <li>Rohit </li>
   <li>Shiba </li>
   <li>Rakesh </li>
</ol>

Output :-

3 Rohit
2 Shiba
1 Rakesh

Type Attributes :- 

Ordered List या Unordered List में अगर आप आपको नंबर या फिर Bullet Point की जगह किसी और Type के Value या फिर Symbol का इस्तेमाल करना हे , तो तब इस Type Attributes का इस्तेमाल किया जाता हे |

जेइसे -

1. Attributes of Ordered List :-

Value - 1/A/a/i/I
Example -

<ol type="A">
   <li>Sanat</li>
   <li>Ram</li>
   <li>Rohit</li>
</ol>

Output:-

A. Sanat
B. Ram
C. Rohit

और इस तरह से आप किसी भी value को add कर सकते हो |

2. Attributes of Unordered List :-

Value - disc/square /circle

इनमे से किसी भी Value को add करके उसका Symbol को Change कर सकते हो ,

Example :-

<ul type="circle">
   <li>Sanat</li>
   <li>Ram</li>
   <li>Rohit</li>
</ul>

Output :-

• Sanat
• Ram
• Rohit

तो ये ही होता हे HTML में List का Concept , उम्मीद करता हु आप लोग इस Concept को अछे से समझ गये होंगे |


Read More :- 

What is HTML in Hindi

Element and Attributes in HTML 

Formatting tags in HTML in Hindi

 

Conclusion :-

हमने आज की इस आर्टिकल के अन्दर HTML के बहत ही Important Concept के बारे में पूरी जानकारी आप लोगो के साथ शेयर की हे , जो हे Table और List , इस आर्टिकल के अन्दर हमने देखा की ये List और Table क्या होता हे , और किस तरह से इस Table और List का अपने HTML के अन्दर implement किये जाते हे , उम्मीद करता हु आप लोगो को ये जानकारी पसंद आया होगा , अगर पसंद आया हे तो अपने दोस्तों के साथ शेयर जरुर करे , और अगर (Tables and List in HTML in Hindi ) इस आर्टिकल के अन्दर दिए जानकारी से किसी भी तरह के कोई भी शाबाल रह गये तो निचे Comment जरुर करे |
धन्यवाद ...